<template>
    <BaseEcharts :chatsOption="chatsOption"></BaseEcharts>
</template>

<script>
    import BaseEcharts from "../../../components/common/Cahrts/coreEcharts"
    import pieBaseConfig from "../../../echartsBaseConfig/pie"

    export default {
        components: {
            BaseEcharts
        },
        data(){
            return {
                chatsOption :  {
                    ...pieBaseConfig,
                    legend: {
                        top: 'bottom',
                        show: false,
                    },

                    series: [
                        {
                            name: '面积模式',
                            type: 'pie',
                            radius: ["40%", "80%"],
                            center: ['50%', '50%'],
                            roseType: 'area',
                            label: {
                                position: 'outer',
                                bleedMargin: 5,
                                fontSize:40,
                                alignTo: 'labelLine',
                            },

                            labelLine: {
                                show: true,
                                length: 10,
                                length2: 150,
                            },
                            data: [
                                {value: 40, name: 'rose 1'},
                                {value: 38, name: 'rose 2'},
                                {value: 32, name: 'rose 3'},
                                {value: 30, name: 'rose 4'},
                                {value: 28, name: 'rose 5'},
                                {value: 26, name: 'rose 6'},
                                {value: 22, name: 'rose 7'},
                                {value: 18, name: 'rose 8'}
                            ]
                        }
                    ]
                }
            }
        },

    }
</script>
